<script setup lang="ts">
import draggable from 'vuedraggable'
import myTopic from "@/composables/myTopic.ts";
const {cats,getCats,delCat,changeSort} = myTopic();
await getCats();
</script>

<template>
<main class="cats" v-if="cats">
  <draggable
      v-model="cats"
      group="people"
      item-key="id"
      @end="changeSort"
      class="grid grid-cols-6 gap-3 p-3">
    <template #item="{element:cat}">
      <admin-cat-item  :cat="cat"  @del="delCat"/>
    </template>
  </draggable>

</main>
</template>

<style lang="scss" scoped>

</style>